<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>layui</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <link rel="stylesheet" href="/static/backend/layui/css/layui.css"  media="all">
  <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
</head>
<body> 
 
<div class="demoTable">
  搜索ID：
  <div class="layui-inline">
    <input class="layui-input" name="id" id="demoReload" autocomplete="off">
  </div>
  <button class="layui-btn" data-type="reload">搜索</button>
</div>
 
<table class="layui-hide" id="LAY_table_user" lay-filter="user"></table> 
               
          
<script src="/static/backend/layui/layui.js" charset="utf-8"></script>
<!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->
<script>
layui.use('table', function(){
  var table = layui.table;
  
  //方法级渲染
  table.render({
    elem: '#LAY_table_user'
    , url: '/backend/user/userList' //数据接口
    , cols: [[ //表头
                 {type:'checkbox',}
                ,{field: 'id', title: 'UID', sort: true,}
                , {field: 'head_img', title: '头像',templet:'<div><img style="border-radius: 50%;overflow: hidden;height:48px;width:48px;" src="{{ d.head_img}}"></div>'}
                , {field: 'mobile', title: '手机',}
                , {field: 'nickname', title: '姓名',}
                , {field: 'parent_id', title: '父级',}
                , {field: 'integral', title: 'GMOD', sort: true,}
                , {field: 'balance', title: 'GMOB', sort: true,}
                , {field: 'create_time', title: '注册时间', sort: true,}
                , {field: 'isShow', title: '状态', templet: '#ISSHOW', sort: true,}
                ,{title: '操作', toolbar: '#barDemo', width: '16%',}
                
            ]]
    ,id: 'testReload'
    ,page: true
    ,height: 315
  });
  
  var $ = layui.$, active = {
    reload: function(){
      var demoReload = $('#demoReload');
      
      //执行重载
      table.reload('testReload', {
        url: '/backend/user/userList'
        ,page: {
          curr: 1 //重新从第 1 页开始
        }
        ,where: {
          key: {
            id: demoReload.val()
          }
        }
      });
    }
  };
  
  $('.demoTable .layui-btn').on('click', function(){
    var type = $(this).data('type');
    active[type] ? active[type].call(this) : '';
  });
});
</script>

</body>
</html>